package com.example.myapplication

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.annotation.DrawableRes
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.IntrinsicSize
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.aspectRatio
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Icon
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            Column {
                Column(Modifier.fillMaxWidth().weight(1f).background(Color(0xf1f1f1f1))) {
                    TopBar();
                    SearchBar();
                    NamesBar();
                    LovesArea();
                }
                NavBar()
            }
        }
    }
}

@Composable
fun TopBar() {
    Row(Modifier.fillMaxWidth().padding(28.dp, 28.dp, 28.dp, 16.dp),
        verticalAlignment = Alignment.CenterVertically) {
        Image(painterResource(R.drawable.ic_launcher_background), "头像",
            Modifier.clip(CircleShape).size(64.dp))
        Column(Modifier.padding(start = 14.dp).weight(1f)) {
            Text("欢迎回来", fontSize = 14.sp, color = Color.Gray)
            Text("小朱", fontSize = 18.sp, fontWeight = FontWeight.Bold)
        }
        Surface(Modifier.clip(CircleShape), color = Color(0xf9f2e4eb)) {
            Image(painterResource(R.drawable.excel), "通知",
                Modifier.padding(10.dp).size(32.dp))
        }
    }
}

@Composable
fun SearchBar() {
    Row(Modifier.padding(24.dp, 2.dp, 24.dp, 6.dp).fillMaxWidth().height(56.dp)
        .clip(RoundedCornerShape(28.dp)).background(Color.White),
        verticalAlignment = Alignment.CenterVertically
    ) {
        var searchText by remember { mutableStateOf("") }
        BasicTextField(searchText, { searchText = it },
            Modifier.padding(start = 24.dp).weight(1f),
            textStyle = TextStyle(fontSize = 15.sp)
        ) {
            if (searchText.isEmpty()) {
                Text("搜搜看？", color = Color(0xffb4b4b4), fontSize = 15.sp)
            }
            it()
        }
        Box(Modifier.padding(6.dp).fillMaxHeight().aspectRatio(1f)
            .clip(CircleShape).background(Color(0xfffa9e51))
        ) {
            Icon(painterResource(R.drawable.excel), "搜索",
                Modifier.size(24.dp).align(Alignment.Center), tint = Color.White
            )
        }

    }
}

@Composable
fun NamesBar() {
    var names = listOf("张三", "李四", "王五", "赵六", "田七", "友八", "听九", "文十")
    var selected by remember { mutableStateOf(0) }
    LazyRow(Modifier.padding(0.dp, 8.dp), contentPadding = PaddingValues(12.dp, 0.dp)) {
        itemsIndexed(names) { index, name ->
            Column(Modifier.padding(12.dp, 4.dp).width(IntrinsicSize.Max)) {
                Text(name, fontSize = 15.sp,
                    color = if(index === selected) Color(0xfffa9e51) else Color(0xffb4b4b4)
                )
                Box(Modifier.fillMaxWidth().padding(top = 4.dp)
                    .height(2.dp).clip(RoundedCornerShape(1.dp))
                    .background(if (index == selected) Color(0xfffa9e51) else Color.Transparent)
                )
            }
        }
    }
}

@Composable
fun LovesArea() {
    Column {
        var names = listOf("张三", "李四", "王五", "赵六", "田七", "友八", "听九", "文十")
        Row(Modifier.padding(24.dp, 12.dp).fillMaxWidth()
        ) {
            Text("TA 爱的", fontSize = 16.sp, fontWeight = FontWeight.Bold)
            Spacer(Modifier.weight(1f))
            Text("查看全部", fontSize = 15.sp, color = Color(0xffb4b4b4))
        }
        LazyRow(horizontalArrangement = Arrangement.spacedBy(24.dp),
            contentPadding = PaddingValues(24.dp, 0.dp)
        ) {
            itemsIndexed(names) { index, name ->
                Box(Modifier.width(200.dp).height(200.dp).background(Color.White).padding(5.dp)) {
                    Column(Modifier.fillMaxWidth()) {
                        Image(painterResource(R.drawable.ic_launcher_background), "TA 爱项目",
                            Modifier.fillMaxWidth().weight(1f));
                        Row(Modifier.fillMaxWidth().padding(5.dp),
                            verticalAlignment = Alignment.CenterVertically,
                            horizontalArrangement = Arrangement.SpaceBetween) {
                            Column {
                                Text("这是标题")
                                Text("生产工具")
                            }
                            Box(Modifier.background(Color.Yellow).width(50.dp).height(40.dp)) {
                                Row(Modifier.fillMaxWidth().fillMaxHeight().align(Alignment.Center),
                                    verticalAlignment = Alignment.CenterVertically) {
                                    Text("♥")
                                    Text("4.4")
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@Composable
fun NavBar() {
    Row(Modifier.height(84.dp).padding(16.dp, 0.dp),
        verticalAlignment = Alignment.CenterVertically) {
        NavItem(R.drawable.excel, "首页", Color.Red)
        NavItem(R.drawable.download, "标签", Color.Gray)
        NavItem(R.drawable.excel, "日历", Color.Gray)
        NavItem(R.drawable.download, "我", Color.Gray)
    }
}

@Composable
fun RowScope.NavItem(@DrawableRes iconRes: Int, description: String, tint: Color) {
    Button(onClick = {},
        Modifier.weight(1f).fillMaxHeight(),
        shape = RectangleShape,
        colors = ButtonDefaults.outlinedButtonColors()) {
        Icon(
            painterResource(iconRes), description, Modifier.size(24.dp).weight(1f),
            tint = tint
        )
    }
}